import { Suspense } from "react"
import { TeachingResources } from "@/components/teaching-resources"
import { Skeleton } from "@/components/ui/skeleton"
import { UploadMaterials } from "@/components/upload-materials"
import { KeywordExtraction } from "@/components/keyword-extraction"
export default function ResourcesPage() {
  return (

    <div className="mx-auto max-w-7xl space-y-6">
      <div className="flex flex-col justify-between gap-4 sm:flex-row sm:items-center">
        <h1 className="text-2xl font-bold md:text-3xl">教学资源</h1>
      </div>
      <div className="flex min-h-screen flex-col">
      <main className="flex-1 p-6 md:p-10">
        <div className="flex items-center justify-between mb-6">
          <h1 className="text-3xl font-bold">课件管理</h1>
        </div>
        <div className="grid gap-6 md:grid-cols-2">
          <div>
            <UploadMaterials />
          </div>
          <div>
            <KeywordExtraction />
          </div>
        </div>
      </main>
    </div>
      <Suspense fallback={<Skeleton className="h-[600px] w-full rounded-lg" />}>
        <TeachingResources />
      </Suspense>
    </div>
  )
}
